.img_wrap{
     position: relative;
     width: 500px;
     height: 100px;
     margin: 300px auto;
     /*声明该容器下的所有子元素同属于一个3D空间*/
     transform-style: preserve-3d;
     animation: rotateCube 10s linear 3;
 }
 .img_wrap img{
     position: absolute;
     width: 120px;
     height: 120px;
     left: 0;
     top: 0;
     bottom: 0;
     right:0;
     margin: auto;
 }
 .img_wrap img::after{
     content: '';
     display: block;
     width: 5px;
     background: red;
 }
 .img_wrap img:nth-child(1){
     transform: rotateY(0deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(2){
     transform: rotateY(30deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(3){
     transform: rotateY(60deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(4){
     transform: rotateY(90deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(5){
     transform: rotateY(120deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(6){
     transform: rotateY(150deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(7){
     transform: rotateY(180deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(8){
     transform: rotateY(210deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(9){
     transform: rotateY(240deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(10){
     transform: rotateY(270deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(11){
     transform: rotateY(300deg) translateZ(250.92px);
 }
 .img_wrap img:nth-child(12){
     transform: rotateY(330deg) translateZ(250.92px);
 }
 @keyframes rotateCube{
     0%{
         transform: rotateY(0);
     }
     100%{
         transform: rotateY(360deg);
     }
 }